// pages/blog-edit/blog-edit.js
//输入文字最大的个数
const MAX_WORDS_NUM = 140

//最大上传的数量
const MAX_IMG_NUM = 9

//初始化数据库
const db = wx.cloud.database()

//输入的文字内容
let content = ""
//获取到的用户信息，比如头像，昵称等
let userInfo = {}
Page({

  /**
   * 页面的初始数据
   */
  data: {
    wordsNum:0, //输入的文字字数
    footerBottom:0, //底部的距离，初始化为0，因为当获取到焦点的时候，需要让提示框再键盘的上面，失去焦点的时候再回去
    images:[],  //把当前选中的图片放进这个图片数组中
    selectPhoto:true, //添加图片元素是否显示  true为显示，当图片达到9张的时候，让+号隐藏
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    // console.log(options)
    userInfo = options
  },
  //文本输入框事件，用于监听输入的字数
  onInput(event){
    // console.log(event)
    //再event能获取到输入的值，也就是event.detail.value，那么把这个值存储到一个变量中，之后通过长度来来判断
    let wordsNum = event.detail.value.length
    if (wordsNum >= MAX_WORDS_NUM) {
      wordsNum = `最大字数为${MAX_WORDS_NUM}`
    }
    this.setData({
      wordsNum
    })
    content = event.detail.value
  },

  //获取焦点
  onFocus(event){
    //模拟器获取的键盘高度为0，再手机上就不是了
    // console.log(event)

    //那就是把获取到的高度直接赋值就可以
    this.setData({
      footerBottom:event.detail.height
    })
  },

  //失去焦点
  onBlur(){
    footerBottom:0
  },

  //选择图片事件
  onChooseImage(){
    //还能再选几张图片，最多是9张
    let max = MAX_IMG_NUM - this.data.images.length
    wx.chooseImage({
      count: max, //最多可以选择的图片张数
      sizeType: ['original', 'compressed'], //所选的图片的尺寸 original:原图  compressed：压缩图
      sourceType: ['album', 'camera'], //选择图片的来源 album：	从相册选图 camera 使用相机
      success: (res) => {
        // console.log(res) 能够获取到存放图片的数组信息
        this.setData({
          //要进行追加数组，因为如果用户放了一张，再相放第二张，那么需要进行追加
          images: this.data.images.concat(res.tempFilePaths)
        })
        //此时代表的是第一次选完之后还剩下几张
        max = MAX_IMG_NUM - this.data.images.length
        this.setData({
          selectPhoto:max <= 0 ? false : true
        })
      },
    })
  },

  //删除图片事件
  onDelImage(event){
    //当点击删除的时候先进行删除，因为splice会返回一个新的数组，那么删除完之后再把数组中心赋值一下就好
    this.data.images.splice(event.target.dataset.index, 1)
    this.setData({
      images:this.data.images
    })
    //判断一下，如果当前图片的个数是否等于最大图片数-1，如果等于那么让+号显示
    if(this.data.images.length == MAX_IMG_NUM -1){
      this.setData({
        selectPhoto:true
      })
    }
  },

  //点击图片预览事件
  onPreviewImage(event){
    //当前预览图片
    wx.previewImage({
      urls: this.data.images, //需要预览的图片链接列表
      current: event.target.dataset.imgsrc  //当前显示图片的链接
    })
  },

  //发布事件
  send(){
    /*
    2.数据 → 云数据库
    数据库：内容，图片（fileID），openid（用户信息的唯一标识） 昵称 头像 时间
    1.图片 → 云存储 fileID 云文件ID
    */

    //判断用户是否输入内容，如果没有不进行发布，如果就是一个空格，那么也不发布
    if (content.trim() === '') {
      wx.showModal({
        title: '请输入内容',
        content: '',  
      })
      return
    }
    wx.showLoading({
      title: '发布中...',
      mask: true,  //是否显示透明蒙层，防止触摸穿透
    })

    //声明一个promise数组，保存每次上传过来的promise对象
    let promiseArr = []

    //声明一个图片ID，因为是多个，所以放到数组中保存起来，之后再渲染到页面上
    let fileIds = []

    //因为每次只能上传一张图片，那么需要进行循环之后依次上传
    for (let i = 0,len = this.data.images.length; i < len; i++) {
      //new一个promise，因为每次上传的过程中都是一个异步的操作，而且要等待用户全部填写完毕的时候才发布，所以需要用到promise.all方法
      let p = new Promise((resolve,reject) => {
        let item = this.data.images[i]
        //取得文件扩展名，exec(g有没有都无影响)就等价于不含有g全局标志的match.即返回数组arr[0]为匹配的完整串.其余的为括号里捕获的字符串
        let suffix = /\.\w+$/.exec(item)[0]
        //将本地资源上传至云存储空间,
        wx.cloud.uploadFile({
          //因为要保障每张图片的唯一性，否则一样的话，后面的会把前面的覆盖
          cloudPath: 'blog/' + Date.now() + '-' + Math.random() * 1000000 + suffix,  //云存储路径
          filePath: item,  //要上传文件资源的路径
          //成功回调
          success: (res) => {
            console.log(res.fileID)
            //因为每次照片是一张一张上传的，所以需要不断的往数组中进行追加
            fileIds = fileIds.concat(res.fileID)
            resolve()
          },
          //失败回调
          fail: (err) => {
            console.error(err)
            reject()
          }
        })
      })
      //把每次循环出来的promise对象放到之前声明的promise数组中
      promiseArr.push(p)
    }
    //存入到云数据库
    Promise.all(promiseArr).then((res)=>{
      db.collection('blog').add({
        data:{
          ...userInfo,
          content,
          img:fileIds,
          createTime:db.serverDate(),   //服务端的时间，云数据库提供的方法
        }
      }).then((res)=>{
        wx.hideLoading()
        wx.showToast({
          title: '发布成功'
        })
        //返回blog页面，并且刷新
        wx.navigateBack()
        //getCurrentPages获取当前页面栈。数组中第一个元素为首页，最后一个元素为当前页面。
        const pages = getCurrentPages()
        //取到上一个页面
        const prevPage = pages[pages.length - 2]
        //调用blog博客页面的onPullDownRefresh下拉刷新的方法
        prevPage.onPullDownRefresh()
      })
    }).catch((err)=>{
      wx.hideLoading()
      wx.showToast({
        title: '发布失败',
      })
    })  
  },
  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {

  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function () {

  }
})